@import 'variables';

.el-menu {
  overflow: auto;
  height: inherit;
  background-color: $sidebarTheme;
  border-right: none;
  &.no-transition {
    transition: none;
  }
  &.el-menu--collapse{
    .el-sub-menu{
      .el-sub-menu__title{
        .el-sub-menu__icon-arrow{
          display: none;
        }
      }
    }
  }
  .el-menu-item {
    color: $sidebarColor;
    padding-right: 0;
    @include ellipsis;
    &:hover {
      background-color: inherit;
    }
    &.is-active {
      color: #ffffff;
      background-color: $systemTheme;
    }
  }
  .el-sub-menu {
    .el-menu-item {
      min-width: 0;
    }
    &.is-active {
      & > .el-submenu__title {
        color: #ffffff;
      }
    }
  }
  .el-sub-menu__title {
    color: $sidebarColor;
    &:hover {
      background-color: inherit;
    }
    & > span {
      display: inline-block;
      max-width: calc(100% - 45px);
      @include ellipsis;
    }
  }
}
